<%@ page contentType="text/html;charset=UTF-8"%>
<%@include file="../../common/sessionValidate.jsp" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML>
<html lang="UTF-8">
<head>
    <title>T_task_node_instance信息维护</title>
    <%@ include file="../../common/meta.jsp"%>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="X-UA-Compatible" content="IE=9">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
    <link rel="stylesheet" href="<%=basePath%>css/my-bootstrap.css" media="screen"  id="tuserskin">
    <link rel="stylesheet" href="<%=basePath%>js/toastr/toastr.css">
    <link rel="stylesheet" href="<%=basePath%>css/bootstrapValidator.min.css">
    <link rel="stylesheet" href="<%=basePath%>css/font-awesome.min.css">
    <script type="text/javascript" src="<%= basePath %>js/jquery.cookie.js"></script>
</head>
<style>
    hr {
        margin-top:1px;
        border-bottom: 1px solid #1BBC9B;
    }
</style>
<body>
<form class="form-horizontal form-bordered form-row-strippe" name="ffAdd" id="ffAdd" mentod="post" role="form" data-toggle="validator" enctype="multipart/form-data">
    <div class="" style="margin-right:2px;padding-right:1px;">

        <!-------------------------- 面板  start--------------------------------->
        <div class="panel panel-primary" >
            <div class="panel-heading clearfix"  id="addHeaderDiv">
            </div>
            <div class="panel-body">
                <div class="row" >
                    <h5>&nbsp;&nbsp;审核流程节点基本信息</h5>
                    <hr>
                    <div class="col-xs-6"><!--start 换列-->
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 审核流程节点实例id</label>
                                <div class="col-xs-9">
                                    <input id="tninstanceid" name="tninstanceid" type="text" class="form-control" placeholder="tninstanceid" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 流程id</label>
                                <div class="col-xs-9">
                                    <input id="taskid" name="taskid" type="text" class="form-control" placeholder="taskid" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 节点id</label>
                                <div class="col-xs-9">
                                    <input id="nodeid" name="nodeid" type="text" class="form-control" placeholder="nodeid" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 节点步骤</label>
                                <div class="col-xs-9">
                                    <input id="nodestep" name="nodestep" type="text" class="form-control" placeholder="nodestep" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 节点状态</label>
                                <div class="col-xs-9">
                                    <input id="tninstancestatus" name="tninstancestatus" type="text" class="form-control" placeholder="tninstancestatus" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 申请人</label>
                                <div class="col-xs-9">
                                    <input id="creater" name="creater" type="text" class="form-control" placeholder="creater" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 申请时间</label>
                                <div class="col-xs-9">
                                    <input id="createtime" name="createtime" type="text" class="form-control" placeholder="createtime" />
                                </div>
                            </div>
                        </div>
                        <!--如果输入元素是偶数个元素，在n=size/2?int时输出2列格式；如果元素是奇数个，需要在n=size/2?int时输出2列格式；需要换列，每行最多显示2列-->
                    </div><!--end 换列--><!--start 换列-->
                    <div class="col-xs-6">
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 更新人</label>
                                <div class="col-xs-9">
                                    <input id="updater" name="updater" type="text" class="form-control" placeholder="updater" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 更新时间</label>
                                <div class="col-xs-9">
                                    <input id="updatetime" name="updatetime" type="text" class="form-control" placeholder="updatetime" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 流程名称</label>
                                <div class="col-xs-9">
                                    <input id="firststep" name="firststep" type="text" class="form-control" placeholder="firststep" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 节点名称</label>
                                <div class="col-xs-9">
                                    <input id="laststep" name="laststep" type="text" class="form-control" placeholder="laststep" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 审核意见</label>
                                <div class="col-xs-9">
                                    <input id="note" name="note" type="text" class="form-control" placeholder="note" />
                                </div>
                            </div>
                        </div>

                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> 审核角色</label>
                                <div class="col-xs-9">
                                    <input id="roleid" name="roleid" type="text" class="form-control" placeholder="roleid" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> <font color="red">审核人（原）</font></label>
                                <div class="col-xs-9">
                                    <input id="useridold" name="useridold" type="text" class="form-control" placeholder="userid" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-3"> <font color="red"> 转交至审核人（新）</font></label>
                                <div class="col-xs-9">
                                    <input id="userid" name="userid" type="text" class="form-control" placeholder="请选择转交的接收人" />
                                    <button class="btn btn-primary btn-small" data-toggle="modal"
                                            data-target="#myModal">选择
                                    </button> <a href="#" onclick="cleanUserid()">清空</a>
                                </div>
                            </div>
                        </div>
                    </div><!--end 换列-->
                </div><!--end row-->
            </div><!--end body-->

            <div class="modal-footer bg-info " id='buttonDiv'>
            </div>
        </div>
        <!--------------------------面板 end------------------------------------>

        <!--------------------------模态框 面板 start ------------------------------------>
        <!-- 模态框（Modal） -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"
                                aria-hidden="true">×
                        </button>
                        <h4 class="modal-title" id="myModalLabel">选择审批人员</h4>
                    </div>
                    <div class="modal-body">
                        <!--------------------------信息列表：带表格面板  start--------------------------------->
                        <p>每页显示<select id="pageSize" class=" label-primary" onchange="Search(0)">
                            <option value="10">10</option>
                            <option value="20">20</option>
                            <option value="30">30</option>
                            <option value="50">50</option>
                        </select>条记录，&nbsp;&nbsp;&nbsp;&nbsp;共有记录：<span id="totalCount"  class="label label-primary">0</span> 条，总页数：<span
                                id="totalPageNo" class="label label-primary">0</span>页。
                        </p>
                        <table id="grid" class="table table-condensed table-striped table-bordered table-hover"
                               class="sortable" cellpadding="0" cellspacing="0" border="0" class="display" width="100%">
                            <thead id="grid_head">
                            <tr>
                                <th onclick="" class="table-checkbox"><input class="group-checkable"
                                                                             name="batchSelectedAll"
                                                                             id="batchSelectedAll" type="checkbox"
                                                                             onclick="selectAll()"></th>
                                <th onclick="sortTableT.sort('grid',0,'String')">登录账号</th>
                                <th onclick="sortTableT.sort('grid',0,'String')">用户名</th>
                                <th onclick="sortTableT.sort('grid',0,'String')">状态</th>
                            </tr>
                            </thead>
                            <tbody id="grid_body"></tbody>
                        </table>
                        <div class="paging-toolbar">
                            <ul class="pager" style='margin-bottom:5px;' id='grid_paging'></ul>
                        </div>

                        <!--------------------------信息列表：带表格面板 end------------------------------------>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" onclick="setSelectUserid()">确认</button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        <!--------------------------模态框 面板 end ------------------------------------>

    </div>
</form>
</body>
</html>

<script src="<%=basePath%>js/bootstrap.min.js"></script>
<!--<script src="<%=basePath%>js/jquery-1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrapValidator.js"></script>-->
<script src="<%=basePath%>js/bootstrap-paginator.min.js"></script>
<script src="<%=basePath%>/js/respond.js"></script>
<script src="<%=basePath%>/js/html5.js"></script>
<script src="<%=basePath%>js/toastr/toastr.js"></script>
<script src="<%=basePath%>js/bootbox.js"></script>
<script src="<%=basePath%>js/jquery.validate.js"></script>
<!-- <script src="<%=basePath%>js/additional-methods.min.js"></script> -->
<script src="<%=basePath%>js/my-jquery-curd.js"></script>
<script src="<%= basePath %>js/tableSortTool.js" ></script>
<script src="<%= basePath %>js/calendar.js" ></script>
<script type="text/javascript">
    //新增保存数据
    function add() {
        $("#addSaveButton").attr("disabled", true);
        var url = "<%=basePath%>t_task_node_instance/saveT_task_node_instance?time="+Math.random();
        var postData = $("#ffAdd").serializeArray();
        //alert(postData);
        $.post(url, postData, function (data) {
            //var data = $.parseJSON(data);
            if (data.result=="success") {
                //保存成功  1.关闭弹出层，
                showSuccessTips("恭喜保存成功!", "提示");
                history.goBack();
            }
            else {
                $("#addSaveButton").removeAttr("disabled");
                showErrorTips("保存数据失败!", "错误信息：");
                return false;
            }
        }).error(function () {
            $("#addSaveButton").removeAttr("disabled");
            showErrorTips("保存数据失败!", "错误信息：");
        });
    }

    //更新修改数据到后台
    function edit(){
        var userid = $("#userid").val();
        //alert("userid="+userid);
        if(""==userid || null==userid){
            alert("请选择'转交至审核人（新）'");
            $("#userid").focus();
        }else{
            $("#editSaveButton").attr("disabled", true);
            var url = "<%=basePath%>t_task_node_instance/updateT_task_node_instanceSHR?time="+Math.random();
            myEdit2(url);
        }
    }

    function cleanUserid() {
        //document.getElementsByName("userid").val ="";
        $("#userid").val("");
        //alert("userid="+$("#userid").val);
    }

    function setSelectUserid() {
        var obj,count,checkvalue;
        checkvalue="";
        obj=document.getElementsByName("batchSelected");
        count=0;
        //alert("obj="+obj+";obj.length="+obj.length);
        for(i=0;i<obj.length;i++)
        {
            if(obj[i].checked==true)
            {
                count++;
                checkvalue = checkvalue + obj[i].value  +",";
            }
        }
        $("#userid").val(checkvalue);
        $('#myModal').modal('hide');  //模态框隐藏
    }

    //根据查询条件，查询列表数据并显示
    function Search(startIndex){
        var pageSize = document.getElementById("pageSize").value;
        var condition = $("#form1").serialize();
        var url = "<%=basePath%>t_user/getAllT_user?startIndex="+startIndex+"&pageSize="+pageSize+"&"+condition+"&time="+Math.random();
        //alert(url);
        $.getJSON(url, function (data){
            //$("#pageSize").html(data.pageSize);
            $("#totalCount").html(data.totalCount);
            $("#totalPageNo").html(data.totalPageNo);
            $("#grid_body").html("");

            //1、表格行内容输出
            $.each(data.items, function(i,item){
                var str="<tr>";
                str+="<td><input class='checkboxes' name='batchSelected' id='batchSelected' type='checkbox' value='"+item.username+"("+item.userid+")'></td>";
                str+="<td>"+doNull(item.userid)+"</td>";
                str+="<td>"+doNull(item.username)+"</td>";
                if(item.status==1){
                    str+="<td><span class='label label-success'>有效</span></td>";
                }else{
                    str+="<td><span class='label label-danger'>无效</span></td>";
                }
                str+="</tr>";
                $("#grid_body").append(str);
            });//end each data;

            //2、分业处理
            var element = $("#grid_paging");
            if(data.totalCount>0){
                //第二种处理分页方案，直接生成分页html内容，然后.html()到目标对象；
                var pageHtml ="";
                pageHtml +='<li><button type="button" class=" btn btn-primary btn-sm " onclick="Search('+data.firstIndex+')">首页</button></li>';
                pageHtml +='<li><button type="button" class=" btn btn-primary btn-sm " onclick="Search('+data.previousIndex+')">上一页</button></li>';
                pageHtml +='<li><button type="button" class=" btn btn-primary btn-sm " >当前第  '+data.currentPageNo+' 页</button></li>';
                pageHtml +='<li><button type="button" class=" btn btn-primary btn-sm " onclick="Search('+data.nextIndex+')">下一页</button></li>';
                pageHtml +='<li><button type="button" class=" btn btn-primary btn-sm " onclick="Search('+data.lastIndex+')">尾页</button></li>';
                element.html(pageHtml);
            }else{
                element.html("");
            }
        })//end getJSON;
    }

    //初始化页面及校验
    $().ready(function(){
        //1、初始化数据显示
        var name = "转交审核人";
        var optype ='<%=request.getParameter("oplx")%>';
        var id='<%=request.getParameter("id")%>';
        //alert("optype="+optype+";id="+id);
        if(optype=='add'){
            $("#ffAdd")[0].reset();/*重置表单*/
            var basePath="<i class='icon-plus'></i>&nbsp;";
            setHeader2("新增"+name, basePath);//设置addHeaderDiv标题文字及按钮
            setButtonDivAdd2();//设置adddiv的 操作按钮
        }else if(optype=='editSHR'){
            var basePath="<i class='icon-pencil'></i>&nbsp;";
            setHeader2("修改"+name, basePath);//设置addHeaderDiv标题文字及按钮
            setButtonDivEdit2();//设置adddiv的 操作按钮
            var url = "<%=basePath%>t_task_node_instance/getT_task_node_instance?id="+id+"&time="+Math.random();
            $.getJSON(url, function (data) {//获取数据，并且自动填充form，自动代码待修改； @todo;
                setValue(data);
                $("#useridold").val(data.userid);
                $("#userid").val("");
                //alert($("#effect_date").val()+""+jsonDateFormat($("#effect_date").val()));
                //$("#effect_date").val(jsonDateFormat($("#effect_date").val())); //重新设置日期类型的值
                Search(0);
            });
            formReadOnly('ffAdd');//设置表单不可修改
        }else if(optype=='view'){
            var basePath="<i class='icon-eye-open'></i>&nbsp;";//设置addHeaderDiv标题文字及按钮
            setHeader2("查看"+name, basePath);
            setButtonDivView2();//设置adddiv的 操作按钮
            var url = "<%=basePath%>t_task_node_instance/getT_task_node_instance?id="+id+"&time="+Math.random();
            $.getJSON(url, function (data) {//获取数据，并且自动填充form，自动代码待修改； @todo;
                setValue(data);
                //alert($("#effect_date").val()+""+jsonDateFormat($("#effect_date").val()));
                //$("#effect_date").val(jsonDateFormat($("#effect_date").val())); //重新设置日期类型的值
            });
            formReadOnly('ffAdd');//设置表单不可修改
        }

        //2、校验脚本初始化，start check
        $("#ffAdd").validate({
            submitHandler:function(form){
                //alert($("#opType").val());
                if($("#opType").val()=="add"){
                    add();
                }else if($("#opType").val()=="edit"){
                    edit();
                }
            },
            rules: {
                tninstanceid: {
                    //required: true,
                    digits: true,
                    //minlength: 1,
                    maxlength: 11
                },
                taskid: {
                    //required: true,
                    digits: true,
                    //minlength: 1,
                    maxlength: 11
                },
                nodeid: {
                    //required: true,
                    digits: true,
                    //minlength: 1,
                    maxlength: 11
                },
                nodestep: {
                    //required: true,
                    digits: true,
                    //minlength: 1,
                    maxlength: 11
                },
                tninstancestatus: {
                    //required: true,
                    maxlength: 45
                },
                creater: {
                    //required: true,
                    maxlength: 45
                },
                createtime: {
                    //required: true,
                    maxlength: 45
                },
                updater: {
                    //required: true,
                    maxlength: 45
                },
                updatetime: {
                    //required: true,
                    maxlength: 45
                },
                firststep: {
                    //required: true,
                    maxlength: 45
                },
                laststep: {
                    //required: true,
                    maxlength: 45
                },
                note: {
                    //required: true,
                    maxlength: 45
                },
                userid: {
                    //required: true,
                    maxlength: 512
                },
                roleid: {
                    //required: true,
                    maxlength: 512
                }
            }, //end rules;
            messages: {
                tninstanceid: {
                    //required: " tninstanceid不能为空！",
                    digits: "<font color='red'>请输入数字，不能输入非数字字符！</font>",
                    //minlength: "<font color='red'>最少输入1位！</font>",
                    maxlength: "<font color='red'> tninstanceid最大支持11位，输入的数据已经超过最大长度！</font>"
                },
                taskid: {
                    //required: " taskid不能为空！",
                    digits: "<font color='red'>请输入数字，不能输入非数字字符！</font>",
                    //minlength: "<font color='red'>最少输入1位！</font>",
                    maxlength: "<font color='red'> taskid最大支持11位，输入的数据已经超过最大长度！</font>"
                },
                nodeid: {
                    //required: " nodeid不能为空！",
                    digits: "<font color='red'>请输入数字，不能输入非数字字符！</font>",
                    //minlength: "<font color='red'>最少输入1位！</font>",
                    maxlength: "<font color='red'> nodeid最大支持11位，输入的数据已经超过最大长度！</font>"
                },
                nodestep: {
                    //required: " nodestep不能为空！",
                    digits: "<font color='red'>请输入数字，不能输入非数字字符！</font>",
                    //minlength: "<font color='red'>最少输入1位！</font>",
                    maxlength: "<font color='red'> nodestep最大支持11位，输入的数据已经超过最大长度！</font>"
                },
                tninstancestatus: {
                    maxlength: "<font color='red'> tninstancestatus最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                creater: {
                    maxlength: "<font color='red'> creater最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                createtime: {
                    maxlength: "<font color='red'> createtime最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                updater: {
                    maxlength: "<font color='red'> updater最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                updatetime: {
                    maxlength: "<font color='red'> updatetime最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                firststep: {
                    maxlength: "<font color='red'> firststep最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                laststep: {
                    maxlength: "<font color='red'> laststep最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                note: {
                    maxlength: "<font color='red'> note最大支持45位,输入的数据已经超过最大长度！</font>"
                },
                userid: {
                    maxlength: "<font color='red'> userid最大支持512位,输入的数据已经超过最大长度！</font>"
                },
                roleid: {
                    maxlength: "<font color='red'> roleid最大支持512位,输入的数据已经超过最大长度！</font>"
                }
            } //end message;
        }); //end validate;
    }) //end funciton read;
</script>
